import 'package:auto_route/auto_route.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
import 'package:rongcloud_im_wrapper_plugin/rongcloud_im_wrapper_plugin.dart';

import '../../../config/route/bt_app_router.gr.dart';
import '../models/bt_im_conversation.dart';
import '../models/bt_conversation_list_model.dart';

class BtConversationItemWidget extends StatelessWidget {
  const BtConversationItemWidget({super.key, required this.index, required this.item, required this.model});

  final int index;
  final BtImConversation item;
  final BtConversationListModel model;

  @override
  Widget build(BuildContext context) {
    return Slidable(
        key: ValueKey(item.targetId ?? ''),
        endActionPane: ActionPane(
          extentRatio: 0.2,
          dragDismissible: false,
          motion: const ScrollMotion(),
          dismissible: DismissiblePane(onDismissed: () {}),
          children: [
            CustomSlidableAction(
              padding: EdgeInsets.zero,
              foregroundColor: const Color(0xffFF453A),
              onPressed: (context) {
                model.deleteConversation(RCIMIWConversationType.private, item.targetId, null);
              },
              child: Container(
                height: double.infinity,
                color: const Color(0xffFF453A),
                child: Center(
                  child: Image.asset(
                    'assets/images/bt_ic_delete.png',
                    width: 24,
                    height: 32,
                  ),
                ),
              ),
            ),
          ],
        ),
        child: InkWell(
          child: Container(
            padding: const EdgeInsets.only(left: 18, top: 16, right: 20, bottom: 16),
            child: Row(crossAxisAlignment: CrossAxisAlignment.start, children: [
              Stack(
                clipBehavior: Clip.none,
                children: [
                  ClipRRect(
                    borderRadius: BorderRadius.circular(22),
                    child: CachedNetworkImage(
                      width: 44,
                      height: 44,
                      fit: BoxFit.cover,
                      imageUrl: item.targetAvatarUrl,
                    ),
                  ),
                  item.unreadCount != '0'
                      ? Positioned(
                          right: -3,
                          top: -3,
                          child: Container(
                            height: 12.2,
                            padding: const EdgeInsets.symmetric(horizontal: 4),
                            decoration: BoxDecoration(
                                color: const Color(0xFFFF0000),
                                borderRadius: BorderRadius.circular(17),
                                border: Border.all(color: Colors.white, width: 1)),
                            child: Transform.translate(
                              offset: const Offset(0, 1),
                              child: Text(
                                item.unreadCount,
                                style: const TextStyle(color: Colors.white, fontSize: 10, height: 1),
                              ),
                            ),
                          ),
                        )
                      : const SizedBox()
                ],
              ),
              Expanded(
                  child: Padding(
                      padding: const EdgeInsets.only(left: 8),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            item.targetName,
                            style: const TextStyle(
                                fontSize: 14, color: Color(0xFF202020), fontWeight: FontWeight.normal),
                          ),
                          const SizedBox(height: 8),
                          Text(
                            item.messageText,
                            maxLines: 1,
                            overflow: TextOverflow.ellipsis,
                            style: const TextStyle(
                                fontSize: 12, color: Color(0x4d000000), fontWeight: FontWeight.normal),
                          ),
                        ],
                      ))),
              Padding(
                  padding: const EdgeInsets.only(left: 28),
                  child: Text(item.operationTime,
                      textAlign: TextAlign.center,
                      style: const TextStyle(
                          fontSize: 10, color: Color(0x4d000000), fontWeight: FontWeight.normal))),
            ]),
          ),
          onTap: () {
            context.router.navigate(ChatRoute(
                targetId: item.targetId, targetName: item.targetName, targetAvatar: item.targetAvatarUrl));
          },
        ));
  }
}
